<template>
  <!--<div class="dashboard-container">-->
  <!--<component :is="currentRole"></component>-->
  <!--</div>-->
  <!--<center>-->
  <!--<img src="https://b-ssl.duitang.com/uploads/item/201501/01/20150101203904_fByZk.thumb.700_0.gif" alt=""-->
  <!--style="width: 200px; height: 200px; margin: 120px auto 0;">-->
  <!--<h1>欢迎访问学生工作管理系统</h1>-->
  <!--</center>-->

  <v-carousel hide-controls>
    <v-carousel-item v-for="(item,i) in items" :src="item.src" :key="i"></v-carousel-item>
  </v-carousel>

</template>

<script>
  import { mapGetters } from 'vuex'
  import adminDashboard from './admin'
  import editorDashboard from './editor'

  import img1 from '@/assets/carousels/1.jpg'
  import img2 from '@/assets/carousels/2.jpg'
  import img3 from '@/assets/carousels/3.png'
  import img4 from '@/assets/carousels/4.png'

  export default {
    name: 'dashboard',
    components: { adminDashboard, editorDashboard },
    data() {
      return {
        currentRole: 'adminDashboard',
        items: [{
          src: img1
        }, {
          src: img2
        }, {
          src: img3
        }, {
          src: img4
        }
        ]
      }
    },
    computed: {
      ...mapGetters([
        'roles'
      ])
    },
    created() {
      if (!this.roles.includes('admin')) {
        this.currentRole = 'editorDashboard'
      }
    }
  }
</script>
